<template>
    <div class="special">
        <div class="content">
            <van-cell title="便秘">
                <template slot="right-icon">
                    <van-checkbox v-model="params.isAstriction" shape="square"></van-checkbox>
                </template>
            </van-cell>
            <van-cell title="糖尿病患者">
                <template slot="right-icon">
                    <van-checkbox v-model="params.isDiabetes" shape="square"></van-checkbox>
                </template>
            </van-cell>
            <van-cell class="special-item" title="神经疾病" style="align-items: flex-end">
                <template slot="label">
                    <div class="flex-box-align">
                        <span class="flex">中风、脊柱损伤、痴呆、截瘫或帕金森病、抑郁症</span>
                        <van-checkbox v-model="params.isPsychosis" shape="square"></van-checkbox>
                    </div>
                </template>
            </van-cell>
            <!--<van-cell title="神经疾病">-->
            <!--<template slot="right-icon">-->
            <!--<van-checkbox v-model="checked" shape="square"></van-checkbox>-->
            <!--</template>-->
            <!--</van-cell>-->
            <van-cell title="既往肠道准备不合格患者">
                <template slot="right-icon">
                    <van-checkbox v-model="params.isGastroenterology" shape="square"></van-checkbox>
                </template>
            </van-cell>
            <van-cell title="肾功能衰竭">
                <template slot="right-icon">
                    <van-checkbox v-model="params.isRenalFailure" shape="square"></van-checkbox>
                </template>
            </van-cell>
            <van-cell title="心脑血管">
                <template slot="right-icon">
                    <van-checkbox v-model="params.isCardiovascularFailure" shape="square"></van-checkbox>
                </template>
            </van-cell>
            <van-cell title="肠道肿瘤">
                <template slot="right-icon">
                    <van-checkbox v-model="params.isIntestinalTumor" shape="square"></van-checkbox>
                </template>
            </van-cell>
            <van-cell title="腹部与盆腔手术史">
                <template slot="right-icon">
                    <van-checkbox v-model="params.isBellyFailure" shape="square"></van-checkbox>
                </template>
            </van-cell>
            <van-cell title="肠道狭窄或憩室">
                <template slot="right-icon">
                    <van-checkbox v-model="params.isIntestinalFailure" shape="square"></van-checkbox>
                </template>
            </van-cell>
            <van-cell title="肝硬化">
                <template slot="right-icon">
                    <van-checkbox v-model="params.isCirrhosis" shape="square"></van-checkbox>
                </template>
            </van-cell>
            <van-cell title="麻醉ASA分级（≥3级是危险因素）">
                <template slot="right-icon">
                    <van-checkbox v-model="params.isAnesthesia" shape="square"></van-checkbox>
                </template>
            </van-cell>
            <van-cell title="家族结直肠癌病史">
                <template slot="right-icon">
                    <van-checkbox v-model="params.isRectumHistory" shape="square"></van-checkbox>
                </template>
            </van-cell>
            <van-cell title="甲状腺疾病">
                <template slot="right-icon">
                    <van-checkbox v-model="params.isThyroidFailure" shape="square"></van-checkbox>
                </template>
            </van-cell>
            <van-cell title="住院治疗">
                <template slot="right-icon">
                    <van-checkbox v-model="params.inHospital" shape="square"></van-checkbox>
                </template>
            </van-cell>
        </div>
        <div class="fixed-bottom flex-box-align">
            <div class="left flex-box-align flex">
                <van-checkbox v-model="checked" shape="square"></van-checkbox>
                <span class="left-txt">以上均无</span>
            </div>
            <div class="right">
                <van-button type="info" @click="handleNext">下一步</van-button>
            </div>
        </div>
    </div>
</template>
<script>
    import format from 'date-fns/format';
    import https from "../https";
    export default {
        components: {
        },
        data() {
            return {
                checked: false,
                params: {
                    "inHospital": false,
                    "isAnesthesia": false,
                    "isAstriction": false,
                    "isBellyFailure": false,
                    "isCardiovascularFailure": false,
                    "isCirrhosis": false,
                    "isDiabetes": false,
                    "isGastroenterology": false,
                    "isIntestinalFailure": false,
                    "isIntestinalTumor": false,
                    "isPsychosis": false,
                    "isRectumHistory": false,
                    "isRenalFailure": false,
                    "isThyroidFailure": false,
                },
            }
        },
        watch: {
            "params": {
                handler: function(newVal, oldVal) {
                    console.log('params', newVal)
                    for (var i in newVal) {
                        if (this.params[i]) {
                            this.checked = false
                        }
                    }
                },
                deep: true,
            },
            "checked": {
                handler: function(newVal, oldVal) {
                    console.log(newVal, this.params)
                    for (var i in this.params) {
//                        this.params[i] = newVal;
//                        if (newVal && newVal !== 'y' && newVal !== 'n') {
                            this.params[i] = false
//                        }
                    }
                },
                deep: true,
            }
        },
        mounted() {
            document.title = '万和制药';
        },
        methods: {
            handleNext() {
                const paramsStorage = JSON.parse(localStorage.getItem('params'));
                for (var i in this.params) {
                    if (this.params[i]) {
                        this.params[i] = 'y'
                    } else {
                        this.params[i] = 'n'
                    }
                }
                localStorage.setItem('params', JSON.stringify({
                    ...paramsStorage,
                    ...this.params
                }));
                this.$router.push("/check")
            },
            handleChangeAll(e) {
                for (var i in this.params) {
                    this.params[i] = !e
                }
            }
        }
    };
</script>
<style lang="scss">
    .special {
        height: 100%;
        background-color: #FAFAFA;
        .content {
            margin-bottom: 2.2rem;
        }
        .fixed-bottom {
            position: fixed;
            width: 100%;
            height: .98rem;
            line-height: .98rem;
            bottom: 0;
            left: 0;
            background-color: #fff;
            .left {
                margin-left: .3rem;
                .left-txt {
                    margin-left: .2rem;
                    color: #333;
                }
            }
            .right {
                margin-right: .33rem;
            }
        }
    }
</style>

